import React from 'react';
import { connect } from 'umi';
import { Divider, Tooltip, message } from 'antd';
import { isSuccess } from '@/utils/request';
import { BUTTON } from '@/pages/SalaryManage/SalaryCalculate/constant/recheckButtonConstant';
import { CHECK_STATUS } from '@/pages/SalaryManage/constant/recheckConstant';

const ItemOperateCell = ({ record, dispatch, dispatchType }) => {
    const cancelCheck = prop => {
        if (prop.disabled) {
            return;
        }
        dispatch({
            type: dispatchType.cancelCheckType,
            payload: {
                payrollId: record.payrollId,
                salaryItemId: record.salaryItemId,
                payrollItemDetailId: record.payrollItemDetailId,
                payrollItemId: record.payrollItemId
            },
            callback(response) {
                if (!isSuccess(response)) {
                    message.error(response.msg);
                    return;
                }
                message.success('取消复核成功');
            }
        });
    };

    /** 复核 */
    const passCheck = prop => {
        if (prop.disabled) {
            return;
        }
        dispatch({
            type: dispatchType.passCheckType,
            payload: {
                payrollId: record.payrollId,
                salaryItemId: record.salaryItemId,
                payrollItemDetailId: record.payrollItemDetailId,
                payrollItemId: record.payrollItemId
            },
            callback(response) {
                if (!isSuccess(response)) {
                    message.error(response.msg);
                    return;
                }
                message.success('复核通过');
            }
        });
    };
    const btnArray = [];
    const buttons = record.buttonList || [];

    buttons.forEach(button => {
        if (BUTTON.IT_CANCEL_CHECK === button.code && CHECK_STATUS.CHECKED.code === record.itemCheckStatus) {
            btnArray.push({
                name: button.disabled ? null : '取消复核',
                fontClass: 'status_cancel iconlistfunction_auditcanceled_icon_default',
                onClick: cancelCheck,
                disabled: button.disabled,
                prop: button
            });
        }

        if (BUTTON.IT_PASS_CHECK === button.code && CHECK_STATUS.CHECKED.code !== record.itemCheckStatus) {
            btnArray.push({
                name: button.disabled ? null : '复核通过',
                fontClass: 'status_approve iconlistfunction_auditpassed_icon_default',
                onClick: passCheck,
                disabled: button.disabled,
                prop: button
            });
        }
    });

    return (
        <div>
            {btnArray.map((item, index, arr) => (
                <React.Fragment key={item.name}>
                    <Tooltip title={item.name}>
                        <i
                            className={['iconfont', item.fontClass, { p_status_disable: item.disabled }]}
                            onClick={() => item.onClick(item)}
                        />
                    </Tooltip>
                    {index + 1 < arr.length ? <Divider type="vertical" /> : null}
                </React.Fragment>
            ))}
        </div>
    );
};

export default connect()(ItemOperateCell);
